import { ChangeDetectionStrategy, Component, computed, signal } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatToolbarModule } from '@angular/material/toolbar';
import { SideMenuComponent } from '@shared/components/menu/side-menu.component';
import { HeaderComponent } from '@shared/components/header/header.component';
import { PageComponent } from '@shared/components/page.component';
import { MatProgressBarModule } from '@angular/material/progress-bar';

@Component({
  selector: 'cne-home',
  standalone: true,
  imports: [
    CommonModule,
    RouterModule,
    MatIconModule,
    MatButtonModule,
    MatSidenavModule,
    MatToolbarModule,
    SideMenuComponent,
    HeaderComponent,
    MatProgressBarModule
  ],
  templateUrl: './home.component.html',
  styleUrl: './home.component.scss',
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class HomeComponent extends PageComponent {
  constructor() {
    super();
  }
  
  // 使用 signals 管理侧边栏状态
  private collapsed = signal(false);
  
  // 计算属性
  collapsedState = computed(() => this.collapsed());
  
  // 切换侧边栏展开/收起状态
  toggleCollapsed(): void {
    this.collapsed.update(current => !current);
  }
}
